import React from "react"
import {connect} from 'react-redux'
import {withRouter} from 'react-router-dom'

// components
import UserCoinsAndCheckIn from "./UserCoinsAndCheckIn/UserCoinsAndCheckIn"
import SteamerCoinsAndCheckIn from "./SteamerCoinsAndCheckIn/SteamerCoinsAndCheckIn";

const MyCoinsAndCheckIn = (props) => {
    // props
    const {
        history,
        userDetail,
        checkinInfo,
        isLogin,
    } = props

    const {
        IsStar,
        Gold,
    } = userDetail

    const {doCheckin,} = props

    const userid = localStorage.getItem('userid')

    const checkIn = () => {
        if (isLogin) {
            doCheckin(userid)
            return
        }
        history.push('login')
    }

    const template = IsStar
        ? <SteamerCoinsAndCheckIn
            checkinInfo={checkinInfo}
            checkIn={checkIn}
            history={history}
            Gold={Gold} />
        : <UserCoinsAndCheckIn
            checkinInfo={checkinInfo}
            checkIn={checkIn}
            Gold={Gold} />

    return template
}

const mapDispatchToProps = ({user: {doCheckin}},) => ({
    doCheckin: (id) => doCheckin(id),
})

export default connect(null, mapDispatchToProps)(withRouter(MyCoinsAndCheckIn))

